<template>
    <el-text size="small">{{ clockText }}</el-text>
</template>

<script setup>
/**
 * 时钟组件
 */
import {ref, onMounted } from 'vue';

const clockText=ref('');

onMounted(() => {
    let info = {}, date = null, week = ['天', '一', '二', '三', '四', '五', '六'];
    setInterval(() => {
        date = new Date();
        info = {
            y: date.getFullYear(),
            m: ('0' + (date.getMonth() + 1)).slice(-2),
            d: ('0' + date.getDate()).slice(-2),
            h: ('0' + date.getHours()).slice(-2),
            i: ('0' + date.getMinutes()).slice(-2),
            s: ('0' + date.getSeconds()).slice(-2),
            day: date.getDay(),
        };
        clockText.value = `${info.y}-${info.m}-${info.d} ${info.h}:${info.i}:${info.s} 星期${week[info.day]}`;
    }, 1000)
})
</script>